<template>
  <section>
    <el-card>
      <el-page-header @back="$router.back()" content="打印表格" />
    </el-card>
    <el-card class="mt-20" header="qs序列化">
      <div class="no-warp">
        {{ heihei(serialization) }}
      </div>
    </el-card>
    <el-card class="mt-20" header="百度的序列化">
      {{ test() }}
    </el-card>
    <el-card class="mt-20" header="JSON">
      {{ JSON.stringify(serialization, null, 2) }}
    </el-card>
  </section>
</template>

<script>
import qs from "qs";
import getSign from "./util.js";

export default {
  data() {
    return {
      serialization: {
        c: {
          ca: 1,
          cb: "hello",
          cc: { cca: 1 },
          cd: [12, 32],
        },
        a: 1,
        b: "asasdsdasd",
        d: [
          { key: 1, label: 2 },
          { key: 2, label: "想你" },
        ],
      },
      url: "localhost:8080/signTest?time=2018-06-13 15:43",
    };
  },
  methods: {
    heihei(obj) {
      return qs.stringify(obj);
    },
    test() {
      return getSign(this.url, this.serialization);
    },
  },
};
</script>

<style>
.na-warp {
  word-wrap: break-word;
  word-break: normal;
  word-break: break-all;
}
</style>
